<!--
 * @Descripttion: 
 * @version: @ 1.0.0
 * @Author: 朱江洲
 * @Date: 2021-11-23 09:44:58
 * @LastEditors: 朱江洲
 * @LastEditTime: 2022-05-12 16:33:35
-->
<template>
  <div>
    <el-dialog
      title="添加增票资质"
      :visible.sync="dialog.incrementShow"
      width="50%"
      :modal="false"
    >
      <el-form
        :model="incrementForm"
        ref="incrementForm"
        :rules="incrementRules"
        label-position="top"
      >
        <el-form-item label="发票抬头" prop="title">
          <el-input v-model="incrementForm.title"></el-input>
        </el-form-item>
        <el-form-item label="纳税人识别号" prop="identifier">
          <el-input v-model="incrementForm.identifier"></el-input>
        </el-form-item>
        <el-form-item label="注册地址" prop="address">
          <el-input v-model="incrementForm.address"></el-input>
        </el-form-item>
        <el-form-item label="注册电话" prop="phone">
          <el-input v-model="incrementForm.phone"></el-input>
        </el-form-item>
        <el-form-item label="开户行名称" prop="bank">
          <el-input v-model="incrementForm.bank"></el-input>
        </el-form-item>
        <el-form-item label="开户行帐号" prop="bankAccount">
          <el-input v-model="incrementForm.bankAccount"></el-input>
        </el-form-item>
      </el-form>

      <span slot="footer">
        <el-button @click="dialog.incrementShow = false">取消</el-button>
        <el-button type="primary" @click="onSubmit">保存</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
import { insertVatInvoice } from "@/api/enterprise/invoiceAst.js";
export default {
  props: {
    dialog: {
      type: Object,
      required: true,
    },
  },
  data() {
    return {
      incrementRules: {
        title: [
          {
            required: true,
            message: "请填写发票内容",
            trigger: "blur",
          },
        ],
        identifier: [
          {
            required: true,
            message: "请填写纳税人识别号",
            trigger: "blur",
          },
        ],
        address: [
          {
            required: true,
            message: "请填写注册地址",
            trigger: "blur",
          },
        ],
        phone: [
          {
            required: true,
            message: "请填写注册电话",
            trigger: "blur",
          },
        ],
        bank: [
          {
            required: true,
            message: "请填写开户行名称",
            trigger: "blur",
          },
        ],
        bankAccount: [
          {
            required: true,
            message: "请填写开户行帐号",
            trigger: "blur",
          },
        ],
      },
      incrementData: [],
      incrementForm: {
        title: "",
        identifier: "",
        address: "",
        phone: "",
        bank: "",
        bank: "",
      },
    };
  },
  methods: {
    onSubmit() {
      this.$refs.incrementForm.validate((valid) => {
        if (!valid) return;
        insertVatInvoice(this.incrementForm).then((res) => {
          this.$message.success(res.msg);
          this.incrementShow = false;
          this.$parent.ordinaryForm.title = this.incrementForm.title;
          this.$parent.ordinaryForm.identifier = this.incrementForm.identifier;
          this.dialog.incrementShow = false;
        });
      });
    },
  },
};
</script>

<style lang="less" scoped>
.el-form {
  display: flex;
  flex-wrap: wrap;
  .el-form-item {
    width: 50%;
    /deep/ .el-input__inner {
      width: 330px;
    }
  }
}
</style>